<template>
    <div class="graduateDesignList">
      <mt-header title="查看毕业设计安排">
        <router-link to="InfoList" slot="left">
          <mt-button icon="back">返回</mt-button>
        </router-link>
        <mt-button icon="more" slot="right"></mt-button>
      </mt-header>

      <mt-cell
        v-for=" (item , index) in graduateList"
        :title="item.graduateDesignId"
        :label="item.label"
        is-link
        @click.native.prevent="checkDetails(index,graduateList)"
      >
      </mt-cell>
      <hr>
      <mt-button type="primary" size="small" class="show-history-button" @click="getList()">显示历史毕业设计</mt-button>
      <!-- history list -->
      <mt-cell
        v-for=" (item , index) in graduateHistoryList"
        :title="item.graduateTitle"
        :label="item.label"
        is-link
        @click.native.prevent="checkDetails(index,graduateHistoryList)"
      >
      </mt-cell>
    </div>
</template>
<style>
</style>
<script>
    export default{
        name : 'graduateDesignList',
        data(){
            return{
                graduateList:[],
                graduateHistoryList:[]
            }
        },
        components:{
        },
        mounted:function(){
            this.$nextTick(function(){
                this.initList();
            })
        },
        methods:{
            //router back
            backOne:function(){
                this.$router.back();
            },
            //init list
            initList:function(){
                // GET /someUrl
                this.$http.get('/static/dt.json').then(response => {
                    //get body current list
                    console.log(response.body.current);
                    for (const element of response.body.graduateList){
                        //push to current list[]
                        this.graduateList.push(element);
                    }
                }, response => {
                    // error callback
                    alert("no file page");
                });
            },
            //load the history
            initHistory:function(){
                // GET /someUrl
                //clear the list
                this.historyList = [];
                //push list
                this.$http.get('http://localhost:8080/TeachingMIS/graduateProgram/getGraduateProgram?page=1&pageSize=100').then(response => {
                    // get history list
                    for (const element of response.body.program){
                        //push to tableData[]
                        this.graduateHistoryList.push(element);
                    }
                }, response => {
                    // error callback
                    alert("no file page");
                });
            },
            getList:function(){
                this.initHistory();
            },

            //check the course details
            checkDetails:function(index,rows){
                this.$router.push({ name: 'GraduateDesignDetails', params: { graduateProgramID: rows[index].graduateProgramID }})
            }

        }
    }
</script>
